<%--
  Created by IntelliJ IDEA.
  User: hjb
  Time: 上午 5:36
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>tour_display</title>
    <%@include file="/pages/common/head.jsp"%>
    <link type="text/css" rel="stylesheet" href="static/css/style.css" >
</head>
<body>
<div id="main">
    <div id="tour">
        <%--查询--%>
        <div class="tour_cond">
            <form action="clientTourServlet" method="get">
                <input type="hidden" name="action" value="pageByPrice">
                价格：<input id="min" type="text" name="min" value="${param.min}"> 元 -
                <input id="max" type="text" name="max" value="${param.max}"> 元
                <input type="submit" value="查询" />
            </form>
        </div>
        <div style="text-align: center">
            <c:if test="${empty sessionScope.cart.items}">
                <%--购物车为空的输出--%>
                <span id="cartTotalCount"> </span>
                <div>
                    <span style="color: red" id="cartLastName">你还没有加入任何旅行团</span>
                </div>
            </c:if>
            <c:if test="${not empty sessionScope.cart.items}">
                <%--购物车非空的输出--%>
                <span id="cartTotalCount">你加入了 ${sessionScope.cart.totalCount} 个旅行团</span>
                <div>
                    您刚刚加入<span style="color: red" id="cartLastName">${sessionScope.lastName}</span>旅行团
                </div>
            </c:if>
        </div>

        <c:forEach items="${requestScope.page.items}" var="tour">
            <div class="b_list">
                <div class="img_div">
                    <img class="tour_img" alt="There is no picture!" src="${tour.image}" />
                </div>
                <div class="tour_info">
                    <div class="tour_name">
                        <span class="sp1">名称:</span>
                        <span class="sp2">${tour.name}</span>
                    </div>
                    <div class="tour_code">
                        <span class="sp1">代号:</span>
                        <span class="sp2">${tour.code}</span>
                    </div>
                    <div class="tour_destination">
                        <span class="sp1">目的地:</span>
                        <span class="sp2">${tour.destination}</span>
                    </div>
                    <div class="tour_basicPrice">
                        <span class="sp1">价格:</span>
                        <span class="sp2">￥${tour.basicPrice}</span>
                    </div>
                    <div class="tour_maxNumber">
                        <span class="sp1">最大人数:</span>
                        <span class="sp2">${tour.maxNumber}</span>
                    </div>
                    <div class="tour_departureTime">
                        <span class="sp1">出发时间:</span>
                        <span class="sp2">${tour.departureTime}</span>
                    </div>
                    <div class="tour_deadline">
                        <span class="sp1">报名截止时间:</span>
                        <span class="sp2">${tour.deadline}</span>
                    </div>
                    <div class="tour_state">
                        <span class="sp1">状态:</span>
                        <span class="sp2">${tour.state}</span>
                    </div>
                    <div class="tour_add">
                        <button tourId="${tour.id}" class="addToCart">加入旅行团</button>
                    </div>
                </div>
            </div>
        </c:forEach>
    </div>
    <Script type="text/javascript">
        $(function () {
            // 给按钮绑定单击事件
            $("button.addToCart").click(function () {
                /**
                 * 在事件响应的function函数 中，有一个this对象，这个this对象，是当前正在响应事件的dom对象
                 * @type {jQuery}
                 */
                var tourId = $(this).attr("tourId");
                // location.href = "http://localhost:8080/travelAgency/cartServlet?action=addItem&id=" + tourId;

                // 发ajax请求
                $.getJSON("http://localhost:8080/travelAgency/cartServlet"+"?action=ajaxAddItem&id=" + tourId,function (data) {
                    $("#cartTotalCount").text("你加入了 " + data.totalCount + " 个旅行团");
                    $("#cartLastName").text(data.lastName);
                })
            });
        });
    </Script>
</div>
<%--静态包含分页条--%>
<%@include file="/pages/common/page_nav.jsp"%>
</body>
</html>
